<template>
    <li class="li">
      <div class="Class">
        <label class="info" id="class">{{ thing[0] }}</label>
      </div>
        <div class="Course">
        <label class="info" id="course">{{ thing[1] }}</label>
      </div>
        <div class="Teacher">
        <Label class="info" id="teacher">{{ thing[2] }}</Label>
      </div>
        <div class="IsCommend">
        <Label class="info" id="isCommend">{{ thing[3] }}</Label>
      </div>
        <div class="Button">
        <label class="info">查看详情</label>
      </div>
    </li>
  </template>
  
  <script>
  export default {
    name: 'OneOfAssessment',
    props:['thing'],
    data() {
      return {
        
      };
    },
  };
  </script>
  

<style scoped>
.li{
  display: flex;
  flex-direction: row;
}

.Class,.Course,.Teacher,.IsCommend,.Button{
    text-align: center;
background-color:  rgba(224, 230, 241, 0.6);
  height:40px;
  border: 0.5px solid rgb(178, 178, 178);
  border-top: 1px solid rgb(178, 178, 178);
}
.Class{
  width: 150px;
  border-left: 4px solid rgb(181, 188, 203);
}
.Course{
  width: 300px;;
}
.Teacher{
  width:250px;
}
.IsCommend{
  width:200px;;
}
.Button{
  width: 170px;
}
.info{
  position: relative;
  top:8px;
  font-family: '黑体';
  font-weight: 1000;
}
li{
    height:40px;
    width:1050px;
}

li:before {
  content: initial;
}

li:last-child {
  border-bottom: none;
}
</style>